import React from 'react'
import {Form, Input, Button, message} from 'antd'
import {reqLogin} from '../../api'
import Footer from '../../components/Footer'
// import memoryUntils from '../../utils/memoryuntils'
// import storageUtils from '../../utils/storageUtils'
// import { Redirect } from 'react-router-dom';

import './index.less'
const FormItem = Form.Item;

export default class Login extends React.Component {
    state = {};

    componentDidMount() {//每次进入登录页清除之前的登录信息
        
    }

    loginReq = () => {
        // window.location.href = '/admin/home';
        window.open('/admin/home','_self')
    };

    render() {
    //     const   user=memoryUntils.user;
    //   if (user||user._id) {
    //   return<Redirect to='/'/>
    //     }
        return (
            <div className="login-page">
                <div className="login-header">
                    <div className="logo">
                        <img src="/assets/logo-ant.svg" alt="慕课后台管理系统"/>
                        React全家桶+AntD 共享经济热门项目后台管理系统
                    </div>
                </div>
                <div className="login-content-wrap">
                    <div className="login-content">
                        <div className="word">共享出行 <br />引领城市新经济</div>
                        <div className="login-box">
                            <div className="error-msg-wrap">
                                <div
                                    className={this.state.errorMsg?"show":""}>
                                    {this.state.errorMsg}
                                </div>
                            </div>
                            <div className="title">欢迎你</div>
                            <LoginForm ref="login" loginSubmit={this.loginReq}/>
                        </div>
                    </div>
                </div>
                <Footer/>
            </div>
        )
    }
}

class LoginForm extends React.Component {
    state = {};

    loginSubmit = (e)=> {
        e && e.preventDefault();
        // this.props.form.validateFields(async(err,values)=>{
        //     if(!err){
        //         const {username,password} =values;
        //        const result=await reqLogin(username,password)
        //         console.log('result:',result)
                
        //   if(username===result.results.username){
        //     if(password===result.results.password){
        //       message.success("登陆成功！")
        //       //获取用户信息
        //    const user =result.results
        //    //存储user信息
        //    memoryUntils.user=user;
        //    storageUtils.saveUser(user) //保存到local中

        //   //  console.log( memoryUntils.user)
        //       //跳转到登陆页面
        //       window.location.href = '/';
        //     }else{
        //       message.error("密码错误")
        //     }
        //   }
        //     }else{
        //         console.log('检验失败')
        //     }
        // })
        
        const _this = this;
        this.props.form.validateFieldsAndScroll((err, values) => {
            if (!err) {
                
                var formValue = _this.props.form.getFieldsValue();
                _this.props.loginSubmit({
                    username: formValue.username,
                    password: formValue.password
                });
            }
        });
    };

    checkUsername = (rule, value, callback) => {
        var reg = /^\w+$/;
        if (!value) {
            callback('请输入用户名!');
        } else if (!reg.test(value)) {
            callback('用户名只允许输入英文字母');
        } else {
            callback();
        }
    };

    checkPassword = (rule, value, callback) => {
        if (!value) {
            callback('请输入密码!');
        } else {
            callback();
        }
    };

    render() {
        const { getFieldDecorator } = this.props.form;
        return (
            <Form className="login-form">
                <FormItem>
                    {getFieldDecorator('username', {
                        initialValue:'admin',
                        rules: [{validator: this.checkUsername}]
                    })(
                        <Input placeholder="用户名"/>
                    )}
                </FormItem>
                <FormItem>
                    {getFieldDecorator('password', {
                        initialValue:'admin',
                        rules: [{validator: this.checkPassword}]
                    })(
                        <Input type="password" placeholder="密码" wrappedcomponentref={(inst) => this.pwd = inst } />
                    )}
                </FormItem>
                <FormItem>
                    <Button type="primary" onClick={this.loginSubmit} className="login-form-button">
                        登录
                    </Button>
                </FormItem>
            </Form>
        )
    }
}
LoginForm = Form.create({})(LoginForm);
